/*****************************************/
/*                                       */
/*  Variables globales du ColorPicker    */
/*                                       */
/*****************************************/
var CP_threadCookieColorSaveTimeoutMiliseconde=250;	//temps après entre la fin du drag et l'ecriture de la couleur dans un cookie
var HISTORY_BORDER_DEFAULT_COLOR='#999999';
var HISTORY_BORDER_SELECTED_COLOR='#000000';
var HISTORY_COOKIES_DOMAIN_PATH=null;  //si vous souhiatez l'usage du cookie a un domaine/sousrepertoire précis
									   //exemple   /rep/colorpicker/
var CP_quality_selector_string=CP_LOCAL_quality_selector+' : <select name="select" id="##ColorPicker.id##_precision" onChange="CP_changePrecisionHandler(this);"><option value="4">'+CP_LOCAL_quality_selector_value_4+'</option><option value="8">'+CP_LOCAL_quality_selector_value_8+'</option><option value="16" selected>'+CP_LOCAL_quality_selector_value_16+'</option><option value="32">'+CP_LOCAL_quality_selector_value_32+'</option></select>';

//--------------- ne pas editer les variables ci-dessous -------------------------------------------
var CP_colorPickerList=new Array(); //liste des color picker de la page
var CP_mouseMode=null;				//mode de drag de la sourie

/*****************************************/
/*                                       */
/*     methode globales du script        */
/*                                       */
/*****************************************/

//recherche l'objet color picker d'apres son id
function CP_findColorPickerById(idColorPicker)  //OK
{
	for(var i=0 ; i<CP_colorPickerList.length ; i++)
	{
		if(CP_colorPickerList[i].id==idColorPicker) { return CP_colorPickerList[i]; }
	}
	return null;
}

//Modification du type de selecteur / palette (cf drop list en haut)
function CP_colorPickerChangeSelectorHandler(obj)
{
  var cp_obj=CP_findColorPickerById(obj.id.replace('_paletteSelector',''));
  if(cp_obj!=null)
  {
	  cp_obj.changeSelector(obj.value);
  }
}

//handleur de l'evenement 'deplacement de la sourie en drag sur l'espace XY
function CP_moveXYHandler(aEvent)
{
 var myEvent = aEvent ? aEvent : window.event; //recuperation de l'evenement
 //on recupere objet cible declencheur de l'evenement
 var target= myEvent.target ? myEvent.target : myEvent.srcElement;
 
 //on sais que target.id est de la forme <idColorPicker>_dragXY, donc on peut deduire le colorpicker concerne
 var colorPickerObj=CP_findColorPickerById(target.id.replace('_dragXY',''));
 
 if(colorPickerObj)
 {
	 //recuperation des coordonnees de la sourie par rapport au conteneur qui a declenche l'evenement
	 if(myEvent.layerX) { colorPickerObj.x=myEvent.layerX; colorPickerObj.y=myEvent.layerY; }
	 else { colorPickerObj.x=myEvent.offsetX; colorPickerObj.y=myEvent.offsetY; }
	
	 colorPickerObj.acquireXY();
	
	 if(CP_mouseMode=='xy')
	 {
		var pointer=colorPickerObj.xyPointer; //document.getElementById('pointerXY');
		pointer.style.left=(colorPickerObj.x-5+colorPickerObj.xDecal)+'px';
		pointer.style.top=(colorPickerObj.y-5+colorPickerObj.yDecal)+'px';
	 }
 }
 return;
}

//handleur de l'evenement 'deplacement de la sourie en drag sur l'espace Z  (zone verticale)
function CP_moveZHandler(aEvent)
{
 var myEvent = aEvent ? aEvent : window.event; //recuperation de l'evenement
 //on recupere objet cible declencheur de l'evenement
 var target= myEvent.target ? myEvent.target : myEvent.srcElement;
 
 //on sais que target.id est de la forme <idColorPicker>_dragZ, donc on peut deduire le colorpicker concerne
 var colorPickerObj=CP_findColorPickerById(target.id.replace('_dragZ',''));
 
 if(colorPickerObj)
 {
	 if(myEvent.layerY) { colorPickerObj.z=myEvent.layerY; }
	 else { colorPickerObj.z=myEvent.offsetY; }

	 colorPickerObj.acquireZ();

	 if(CP_mouseMode=='z')
	 {
		var pointer=colorPickerObj.zPointer;
		pointer.style.top=(colorPickerObj.z-4+colorPickerObj.yDecal)+'px';
	 }
 }
 return;
}

//handler public de detection d chanegemnt de resolution
function CP_changePrecisionHandler(obj)
{
	var colorPicker=CP_findColorPickerById(obj.id.replace('_precision',''));
	if(colorPicker)
	{
		colorPicker.changePrecision(obj.value);
	}
}

//on indique qu'il y a eu une modification sur un des champs input:text
// l'argument et l'objet de type input qui a été modifié
function CP_changeHandler(obj)
{
	var id=obj.id.substr(0,obj.id.length-2);
	if(obj.id.substr((obj.id.length-3),(obj.id.length-1))=='hex')
	{
		id=obj.id.substr(0,obj.id.length-4);
	}
	var colorPicker=CP_findColorPickerById(id);
	if(colorPicker) { colorPicker.change(obj); }
}

//handler qui détecte une mofication de l'axe Z, cad un modification de groupe radio  (h,s,v,r,g,b)
function CP_changeZAxisHandler(obj)
{
	//rechercher de l'id du colorpicker
	var tmp=new Array();
	tmp=obj.id.split('_');
	var cpid='';
	for(var i=0 ; i<tmp.length-2 ; i++) { if(i>0) {cpid+='_'; } cpid+=tmp[i]; }
	
	var colorPicker=CP_findColorPickerById(cpid);
	if(colorPicker)
	{
		var toTest='HSVRGB';
		var i;
		for(i=0 ; i<toTest.length ; i++)
		{
		  if(document.getElementById(colorPicker.id+'_Z_'+toTest.charAt(i)).checked)
		  {
			colorPicker.actualZ=(''+toTest).charAt(i).toLowerCase();  //lancement de la fonction de changement de Z de la class ColorPicker
		  }
		}
		colorPicker.change(document.getElementById(colorPicker.id+'_r'));
		colorPicker.changeSelector('perceptual');
	}
}

//fonction de corretion et de filtrage des entree
// arguments:
//   -obj : obj input du dom dont on doit controleur la valeur
//   -comp : nom de la composante que represente ce champ ('hex','h','s','v','r','g','b','c','m','y','k')
function CP_controlValueInInput(obj,comp)
{
	var validChar='0123456789';
	if(comp=='hex') { validChar+='ABCDEF#'; }
	var val=obj.value.toUpperCase();
	var newVal='';
	for(i=0 ; i<val.length ; i++)
	{
	  if(validChar.indexOf(val.charAt(i))>=0) { newVal+=val.charAt(i); }
	}
	
	if(comp=='hex')
	{
		  newVal=newVal.replace(/#/gi,'');
		  newVal='#'+newVal+'000000';
		  newVal=newVal.substr(0,7);
	} else {
		var _min=0;
		var _max=100;
		if(comp=='h') { _max=360; }
		if(comp=='r' || comp=='g' || comp=='b') { _max=255; }
		if(newVal>_max) { newVal=_max; }
		if(newVal<_min) { newVal=_min; }
	}
	obj.value=newVal;
	return;
}

//clique sur une case de l'historique => sélection du slot
function CP_historyClickHandler(aEvent)
{
	var myEvent = aEvent ? aEvent : window.event; //recuperation de l'evenement
	//on recupere objet cible declencheur de l'evenement
	var target= myEvent.target ? myEvent.target : myEvent.srcElement;
	
	//on sais que target.id est de la forme <idColorPicker>_historyArea_<numero>, donc on peut deduire le colorpicker concerne
	var tmp=new Array();
	tmp=target.id.split('_');
	var cpid='';
	for(var i=0 ; i<tmp.length-2 ; i++) { if(i>0) {cpid+='_'; } cpid+=tmp[i]; }
	var historyNum=tmp[tmp.length-1];
	var colorPicker=CP_findColorPickerById(cpid);
	if(colorPicker)
	{
		document.getElementById(colorPicker.id+'_historyTd_'+colorPicker.currentHistoryIdSelected).style.borderColor=HISTORY_BORDER_DEFAULT_COLOR;
		colorPicker.currentHistoryIdSelected=historyNum;
		document.getElementById(colorPicker.id+'_historyTd_'+colorPicker.currentHistoryIdSelected).style.borderColor=HISTORY_BORDER_SELECTED_COLOR;
	}
}

//double clique sur une case de l'historique, pour recharger la couleur du slot (sauf si slot vide)
function CP_histotyDblClickHandler(aEvent)
{
	var myEvent = aEvent ? aEvent : window.event; //recuperation de l'evenement
	//on recupere objet cible declencheur de l'evenement
	var target= myEvent.target ? myEvent.target : myEvent.srcElement;
	
	//on sais que target.id est de la forme <idColorPicker>_historytd_<numero>, donc on peut deduire le colorpicker concerne
	var tmp=new Array();
	tmp=target.id.split('_');
	var cpid='';
	for(var i=0 ; i<tmp.length-2 ; i++) { if(i>0) {cpid+='_'; } cpid+=tmp[i]; }
	var historyNum=tmp[tmp.length-1];
	
	var colorPicker=CP_findColorPickerById(cpid);
	if(colorPicker)
	{
		document.getElementById(colorPicker.id+'_historyTd_'+colorPicker.currentHistoryIdSelected).style.borderColor=HISTORY_BORDER_DEFAULT_COLOR;
		colorPicker.currentHistoryIdSelected=historyNum;
		var td=document.getElementById(colorPicker.id+'_historyTd_'+colorPicker.currentHistoryIdSelected);
		var cl=td.style.backgroundColor;
		if(cl.indexOf('rgb(')==0) { cl=RGB2HEX(cl); }
		if(cl!='')
		{
			colorPicker.set('hex',cl);
			colorPicker.change(document.getElementById(colorPicker.id+'_hex'));
		}
		else { alert(CP_LOCAL_error_restoring_empty_slot); }
		td.style.borderColor=HISTORY_BORDER_SELECTED_COLOR;
	}
}

//Place une couleur dans l'historique d'un color picker
function CP_setHistory(aEvent)
{
 var myEvent = aEvent ? aEvent : window.event; //recuperation de l'evenement
 //on recupere objet cible declencheur de l'evenement
 var target= myEvent.target ? myEvent.target : myEvent.srcElement;
 
 //on sais que target.id est de la forme <idColorPicker>_currentSpace, donc on peut deduire le colorpicker concerne
 var colorPicker=CP_findColorPickerById(target.id.replace('_currentSpaceArea',''));
 if(colorPicker)
 {
	document.getElementById(colorPicker.id+'_historyTd_'+colorPicker.currentHistoryIdSelected).style.backgroundColor=colorPicker.get('hex');
	createCookie(colorPicker.id+'_historyColor_'+colorPicker.currentHistoryIdSelected,colorPicker.get('hex'),null,HISTORY_COOKIES_DOMAIN_PATH);
 }
}

function CP_loadInitialColor(aEvent)  //Pour le chargement de la couleur initiale
{
 var myEvent = aEvent ? aEvent : window.event; //recuperation de l'evenement
 //on recupere objet cible declencheur de l'evenement
 var target= myEvent.target ? myEvent.target : myEvent.srcElement;
 
 //on sais que target.id est de la forme <idColorPicker>_currentSpaceOld, donc on peut deduire le colorpicker concerne
 var colorPicker=CP_findColorPickerById(target.id.replace('_currentSpaceOldArea',''));
 if(colorPicker)
 {
	var tmp=document.getElementById(colorPicker.id+'_currentSpaceOld').style.backgroundColor;
	if(tmp.indexOf('rgb')!=-1) { tmp=RGB2HEX(tmp); }
	colorPicker.set('hex',tmp);
	colorPicker.change(document.getElementById(colorPicker.id+'_hex')); 
 }
}